<template>

    <div class="container">


        <el-row>
             <el-col :span="24">
                 logo
             </el-col>

        </el-row>
        <el-row>

            <el-col :span="6">
                 siderbar
            </el-col>
            <el-col :span="18">
                 content
            </el-col>

        </el-row>

    </div>

</template>

<script>
    /**
     * 栅格系统 :   grid system
     *
     *     container
     *     row
     *     col
     *     gutter
     *     offset
     *
     *     bootstrap    12格
     *     element-ui   24格
     *
     *       上
     *       左-右
     *     布局原则 ：
     *          1. 先行后列
     *
     * */



    export default {
        name: "Grid"
    }
</script>

<style scoped>


    .container{
          background-color: #42b983;
    }

    .el-row{
         background-color: bisque;
    }

    .el-col{
        border: 1px solid;
    }
</style>